<!--
 * @Author: yxiawen
 * @Date: 2022-01-15 17:15:00
 * @LastEditTime: 2022-01-24 16:30:34
 * @LastEditors: yxiawen
 * @Description: 
 * @FilePath: /vite-project/src/views/bannerMgt/bannerMgt.vue
-->
<template>
  <div class="">
    <a-table :dataSource='dataSource'
             :columns="columns"></a-table>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

import { reactive, onMounted, toRefs, getCurrentInstance } from "vue";
export default {
  name: "",
  //import引入的组件需要注入到对象中才能使用
  components: {},
  setup() {
    const state = reactive({
      dataSource: [],
      columns: [
        {
          title: "id",
          dataIndex: "key",
        },
        {
          title: "title",
          dataIndex: "title",
        },
        {
          title: "create_time",
          dataIndex: "create_time",
        },
        {
          title: "author",
          dataIndex: "author",
        },
      ],
    });
    const {
      appContext: {
        config: { globalProperties },
      },
    } = getCurrentInstance();
    // 在组件的第一次渲染后调用，该元素现在可用，允许直接DOM访问
    onMounted(() => {
      globalProperties.$apis.bannerApi.getBannerList().then((res) => {
        state.dataSource = res.data;
      });
    });
    return {
      ...toRefs(state),
    };
  },
};
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
</style>
